// 库引入
import React, {Component} from 'react';
import {inject, observer} from 'mobx-react';
import classNames from 'classnames';

// 组件引入
import {Item} from './Item';

// 样式引入
import styles from './style.module.less';

@observer
class TextLinkList extends Component {
  render() {
    return (
      <ul
        className={classNames(styles.textLinkList, this.props.className)}
        style={this.props.style}>
        {this
          .props
          .data
          .map(item => (<Item className={styles.textLinkListItem} key={item.id} to={item.to} value={item.value}/>))}
      </ul>
    );
  }
}

TextLinkList.defaultProps = {
  data: [
    {
      id: '1',
      to: '/',
      value: 'Bootstrap中文网'
    }, {
      id: '2',
      to: '/',
      value: 'Ghost中文网'
    }
  ]
};

const InjectTextLinkList = inject(({
  someStore = {}
}) => ({someProps: someStore.attribute}))(TextLinkList);

export {TextLinkList, InjectTextLinkList};